<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
			<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0"><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />   
        <title>Welcome to Design Zone......</title>
        <link rel="stylesheet" type="text/css" href="../../scripts/ext/resources/css/ext-all.css" />
        <link rel="stylesheet" type="text/css" href="../../scripts/ext/resources/css/file-upload.css" />
        <link rel="stylesheet" type="text/css" href="../../styles/dzbase.css" />
        <script type="text/javascript" src="../../scripts/ext/adapter/ext-base.js">
        </script>
        <script type="text/javascript" src="../../scripts/ext/ext-all.js">
        </script>
        <script type="text/javascript" src="../../scripts/form/FileUploadField.js">
        </script>
        <script type="text/javascript" src="../../scripts/i18nMessage.js">
        </script>
        <script type="text/javascript" src="../../scripts/utils.js">
        </script>
        <script type="text/javascript">
            var referenceMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.reference');
            var message = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=message');
            
            var ctMachineTypeXmlLoader = new xmlLoader('../../servlet/CodeTableServlet?name=CtMachineType');
            var ctMachineTypeStore = new Ext.data.Store({
                reader: new Ext.data.XmlReader({
                    record: 'item',
                    id: 'code',
                    totalRecords: 'itemTotal'
                }, ['code', 'description']),
                data: ctMachineTypeXmlLoader.getXml()
            });
            
            var ctMachineTypeCombo = new Ext.form.ComboBox({
                fieldLabel: referenceMessage.get('ui.reference.machinetype'),
                id: 'ctMachineType',
                name: 'ctMachineType',
                allowBlank: false,
                blankText: message.get('message.edit.noblank'),
                valueField: 'code',
                typeAhead: true,
                store: ctMachineTypeStore,
                displayField: 'description',
                forceSelection: true,
                triggerAction: 'all',
                emptyText: message.get('message.combo.pleaseselect'),
                selectOnFocus: true,
                mode: 'local'
            });
            
            Ext.onReady(function(){
                Ext.QuickTips.init();
                
                // turn on validation errors beside the field globally
                Ext.form.Field.prototype.msgTarget = 'side';
                
                var idValue = getPrarmeterValue(window.location, 'id');
                var startPage = getPrarmeterValue(window.location, 'startPage');
                var referenceForm = new Ext.FormPanel({
                    fileUpload: true,
                    labelAlign: 'left',
                    labelWidth: 75, // label settings here cascade unless overridden
                    url: '../../servlet/BiReferenceServlet?action=1',
                    frame: true,
                    reader: new Ext.data.XmlReader({
                        record: 'item'
                    }, [{
                        name: 'id',
                        mapping: 'id'
                    }, {
                        name: 'ctMachineType',
                        mapping: 'ctMachineType'
                    }, {
                        name: 'needle',
                        mapping: 'needle'
                    }, {
                        name: 'weight',
                        mapping: 'weight'
                    }, {
                        name: 'reference',
                        mapping: 'reference'
                    }, {
                        name: 'front',
                        mapping: 'front'
                    }, {
                        name: 'back',
                        mapping: 'back'
                    }, {
                        name: 'sleeves',
                        mapping: 'sleeves'
                    }, {
                        name: 'bottomThrum',
                        mapping: 'bottomThrum'
                    }, {
                        name: 'sleevesThrum',
                        mapping: 'sleevesThrum'
                    }, {
                        name: 'necklineThrum',
                        mapping: 'necklineThrum'
                    }, {
                        name: 'comment',
                        mapping: 'comment'
                    }, {
                        name: 'frontPhotoName',
                        mapping: 'frontPhotoName'
                    }, {
                        name: 'backPhotoName',
                        mapping: 'backPhotoName'
                    }, {
                        name: 'otherPhotoName',
                        mapping: 'otherPhotoName'
                    }]),
                    title: referenceMessage.get('ui.reference.edittitle'),
                    bodyStyle: 'padding:5px 5px 5px 5px',
                    defaults: {
                        width: '90%'
                    },
                    
                    items: [{
                        id: 'id',
                        name: 'id',
                        xtype: 'hidden'
                    },{
                        id: 'frontPhotoName',
                        name: 'frontPhotoName',
                        xtype: 'hidden'
                    },{
                        id: 'backPhotoName',
                        name: 'backPhotoName',
                        xtype: 'hidden'
                    },{
                        id: 'otherPhotoName',
                        name: 'otherPhotoName',
                        xtype: 'hidden'
                    }, {
                        layout: 'column',
                        items: [{
                            columnWidth: .33,
                            layout: 'form',
                            items: [{
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.reference'),
                                id: 'reference',
                                name: 'reference',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.weight'),
                                id: 'weight',
                                name: 'weight',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.sleeves'),
                                id: 'sleeves',
                                name: 'sleeves',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.necklinethrum'),
                                id: 'necklineThrum',
                                name: 'necklineThrum',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'fileuploadfield',
                                width: '80%',
                                id: 'otherPhoto',
                                emptyText: message.get('message.edit.selectimage'),
                                fieldLabel: referenceMessage.get('ui.reference.otherphoto'),
                                name: 'otherPhoto',
                                buttonCfg: {
                                    text: '',
                                    iconCls: 'uploadIcon'
                                }
                            }]
                        }, {
                            columnWidth: .33,
                            layout: 'form',
                            items: [{
                                fieldLabel: referenceMessage.get('ui.reference.needle'),
                                id: 'needle',
                                name: 'needle',
                                anchor: '86%',
                                xtype: 'numberfield',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 128,
                                tabIndex: 2
                            }, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.front'),
                                id: 'front',
                                name: 'front',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.bottomthrum'),
                                id: 'bottomThrum',
                                name: 'bottomThrum',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'fileuploadfield',
                                width: '80%',
                                id: 'frontPhoto',
                                emptyText: message.get('message.edit.selectimage'),
                                fieldLabel: referenceMessage.get('ui.reference.frontphoto'),
                                name: 'frontPhoto',
                                buttonCfg: {
                                    text: '',
                                    iconCls: 'uploadIcon'
                                }
                            }]
                        }, {
                            columnWidth: .33,
                            layout: 'form',
                            items: [ctMachineTypeCombo, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.back'),
                                id: 'back',
                                name: 'back',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'textfield',
                                fieldLabel: referenceMessage.get('ui.reference.sleevesthrum'),
                                id: 'sleevesThrum',
                                name: 'sleevesThrum',
                                anchor: '86%',
                                allowBlank: false,
                                blankText: referenceMessage.get('message.edit.noblank'),
                                maxLength: 64,
                                tabIndex: 1
                            }, {
                                xtype: 'fileuploadfield',
                                width: '80%',
                                id: 'backPhoto',
                                emptyText: message.get('message.edit.selectimage'),
                                fieldLabel: referenceMessage.get('ui.reference.backphoto'),
                                name: 'backPhoto',
                                buttonCfg: {
                                    text: '',
                                    iconCls: 'uploadIcon'
                                }
                            }]
                        }]
                    }, {
                        fieldLabel: message.get('message.edit.comment'),
                        name: 'comment',
                        xtype: 'textarea',
                        maxLength: 512,
                        width: '90%',
                        maxLengthText: message.get('message.edit.toolong')
                    }],
                    
                    buttons: [{
                        text: message.get('message.edit.save'),
                        handler: function(){
                            if (referenceForm.getForm().isValid()) {
                                //referenceForm.hide();
								document.getElementsByName('ctMachineType')[0].value = ctMachineTypeCombo.getValue();
                                referenceForm.getForm().submit({
                                    method: 'post',
                                    success: function(form, action){
                                        //alert(form);
                                        messageTip.msg(message.get('message.tip'), message.get('message.edit.successful'));
                                        referenceForm.getForm().reset();
                                        //referenceForm.show();
                                    },
                                    failure: function(form, action){
                                        //alert(form);
                                        messageTip.msg(message.get('message.tip'), message.get('message.edit.unsuccessful'));
                                        //referenceForm.show();
                                    }
                                });
                            }
                        }
                    }, {
                        text: message.get('message.edit.reset'),
                        handler: function(){
                            msItemForm.getForm().reset();
                        }
                    }, {
                        text: message.get('message.edit.cancel'),
                        handler: function(){
                            if (startPage != null) {
                                window.location = 'reference_list.html?startPage=' + startPage;
                            }
                            else {
                                window.location = 'reference_list.html';
                            }
                        }
                    }]
                });
                
                referenceForm.render('referenceFormDiv');
                new Ext.Resizable('customImg', {
                    wrap: true,
                    pinned: true,
                    dynamic: true,
                    handles: 'all',
                    draggable: true
                });
                
                new Ext.Resizable('customImg1', {
                    wrap: true,
                    pinned: true,
                    dynamic: true,
                    handles: 'all',
                    draggable: true
                });
				
				new Ext.Resizable('customImg2', {
                    wrap: true,
                    pinned: true,
                    dynamic: true,
                    handles: 'all',
                    draggable: true
                });
                
                if (idValue != null) {
                    document.getElementById('id').value = idValue;
                    referenceForm.getForm().load({
                        url: '../../servlet/BiReferenceServlet?action=3&id=' + idValue,
                        waitMsg: Ext.LoadMask.prototype.msg,
						success: function(form, action){
								document.getElementById('customImg').src =  '../../_temp/' + document.getElementById('frontPhotoName').value;
								document.getElementById('customImg1').src =  '../../_temp/' + document.getElementById('backPhotoName').value;
								document.getElementById('customImg2').src =  '../../_temp/' + document.getElementById('otherPhotoName').value;
						}
                    });
                }
            });
        </script>
    </head>
    <body>
        <div id="referenceFormDiv">
        </div>
		<img id="customImg" src="../../_temp/noimage.gif" style="position:absolute;left: 20%;width: 250px;"/>
		<img id="customImg1" src="../../_temp/noimage.gif" style="position:absolute;left: 40%;width: 250px;"/>
		<img id="customImg2" src="../../_temp/noimage.gif" style="position:absolute;left: 60%;width: 250px;"/>
    </body>
</html>
